<template>
  <el-form>
    <el-form-item label="昵称">
      <el-input v-model.trim="user.nickname" />
    </el-form-item>
    <el-form-item label="手机号">
      <el-input v-model.trim="user.mobile" />
    </el-form-item>
    <el-form-item label="性别">
      <el-input v-model.trim="user.sex" />
    </el-form-item>
    <el-form-item>
      <el-button type="primary" @click="update">更新</el-button>
    </el-form-item>
  </el-form>
</template>

<script>
import api from "../../../api";
import qs from "qs";
export default {
  data() {
    return {
      user: {
        id: "",
        nickname: "",
        sex: "",
        mobile: "",
      },
    };
  },
  mounted() {this.http()},
  methods: {
    http() {
      api.personInfogetUser().then((res) => {
        if (res.data.code == 2001) {
          this.user.nickname = res.data.data.nickname;
          this.user.mobile = res.data.data.mobile;
          this.user.sex = res.data.data.sex;
          this.user.id = res.data.data.id;
        }
      });
    },
    update() {
      api.personInfoupdate(qs.stringify(this.currentRow)).then((res) => {
        if (res.data.code == 2001) {
          this.$message({
            type: "success",
            message: "更新成功!",
          });
          this.http()
        }
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.user-activity {
  .user-block {
    .username,
    .description {
      display: block;
      margin-left: 50px;
      padding: 2px 0;
    }

    .username {
      font-size: 16px;
      color: #000;
    }

    :after {
      clear: both;
    }

    .img-circle {
      border-radius: 50%;
      width: 40px;
      height: 40px;
      float: left;
    }

    span {
      font-weight: 500;
      font-size: 12px;
    }
  }

  .post {
    font-size: 14px;
    border-bottom: 1px solid #d2d6de;
    margin-bottom: 15px;
    padding-bottom: 15px;
    color: #666;

    .image {
      width: 100%;
      height: 100%;
    }

    .user-images {
      padding-top: 20px;
    }
  }

  .list-inline {
    padding-left: 0;
    margin-left: -5px;
    list-style: none;

    li {
      display: inline-block;
      padding-right: 5px;
      padding-left: 5px;
      font-size: 13px;
    }

    .link-black {
      &:hover,
      &:focus {
        color: #999;
      }
    }
  }
}

.box-center {
  margin: 0 auto;
  display: table;
}

.text-muted {
  color: #777;
}
</style>